<template>
  <view class="home">
    <navBar :languageSwitch="languageSwitch" @submitLanguage="submitLanguage"></navBar>
<!--    <view class="home-lingqu-jixu">-->
<!--      <view class="home-lingqu-jixu-top">-->
<!--        <view class="home-lingqu-jixu-top-left">-->
<!--          <view>-->
<!--            <img class="img-linqu-jixu-top-left-img" src="../../static/jiaoyi/zhuzhao/1.png" alt="">-->
<!--          </view>-->
<!--          <view class="img-linqu-jixu-top-left-title">-->
<!--            USDT-->
<!--          </view>-->
<!--        </view>-->
<!--        <view class="home-ling-title-right">-->
<!--          <view>-->
<!--            {{lastTime}}-->
<!--          </view>-->
<!--          <view>-->
<!--            {{balance}}-->
<!--          </view>-->
<!--        </view>-->
<!--      </view>-->

<!--      <div class="category-1">-->
<!--        <input class="category-1-2" focus :placeholder="placeholder" />-->
<!--        <div class="category-1-1">-->
<!--          <div class="category-1-1-1"></div>-->
<!--          <div class="category-1-1-2">{{all}}</div>-->
<!--        </div>-->
<!--      </div>-->

<!--      <div class="category-2">-->
<!--        {{castingMining}}-->
<!--      </div>-->
<!--      <div style="height: 10px"></div>-->
<!--    </view>-->

    <view class="home-lingqu-jixu-1">
      <div style="height: 10px"></div>
      <div class="category-3">
        <div class="category-3-1">
          <div>{{Commission}}</div>
          <div style="height: 10px"></div>
          <div>0</div>
        </div>
        <div class="category-3-1">
          <div>{{Dividend}}</div>
          <div style="height: 10px"></div>
          <div>0</div>
        </div>
        <div></div><div></div><div></div>
      </div>
      <div style="height: 20px"></div>
      <div class="category-1">
        <div class="category-4">
          <div class="category-4-1">{{Mining}}</div>
          <div class="category-4-2">0</div>
        </div>
        <div class="category-1-1">
          <div class="category-5">{{receive}}</div>
        </div>
      </div>
      <div style="height:300px"></div>

    </view>

  </view>
</template>

<script setup>
import navBar from '../../component/navBar.vue'
import {ref, reactive} from "vue";
import {onShow} from "@dcloudio/uni-app";

let languageSwitch = ref(true);

//文档
let lastTime = ref('上次:');
let balance = ref('余額：');
let placeholder = ref('請輸入USDT數量');
let all = ref('全部')
let castingMining = ref('鑄造挖礦');
let Commission = ref('傭金');
let Dividend = ref('分紅');
let Mining = ref('挖礦收益');
let receive = ref('領取');

const submitLanguage = (row)=>{}


onShow(()=>{
  getLanguages();
})

const getLanguages = ()=>{
  const lang = uni.getStorageSync('LANG_KEY')
  if(lang === '中文'){
    lastTime.value='上次:';
    balance.value='余額:';
    placeholder.value='請輸入USDT數量';
    all.value='全部';
    castingMining.value='鑄造挖礦';
    Commission.value='傭金';
    Dividend.value='分紅';
    Mining.value='挖礦收益';
    receive.value='領取';
  }
  if(lang === 'Eng'){
    lastTime.value='Last Time:';
    balance.value='Balance:';
    placeholder.value='Please enter USDT quantity';
    all.value='ALL'
    castingMining.value='Casting Mining';
    Commission.value='Commission';
    Dividend.value='Dividend';
    Mining.value='Mining';
    receive.value='Receive';
  }
  if (lang === '日本語'){
    lastTime.value='前回:';
    balance.value='残高:';
    placeholder.value='USDTの数量を入力してください';
    all.value='全て'
    castingMining.value='鋳造掘削';
    Commission.value='コミッション';
    Dividend.value='配当金';
    Mining.value='掘削収益';
    receive.value='受け取る';
  }
  if (lang === '한국어'){
    lastTime.value='최근:';
    balance.value='잔액:';
    placeholder.value='USDT 수량을 입력하십시오';
    all.value='전체'
    castingMining.value='캐스팅 마이닝';
    Commission.value='수수료';
    Dividend.value='배분';
    Mining.value='채굴 수익';
    receive.value='받기';
  }
}

</script>

<style scoped>
.category-3{
  display: flex;
  justify-content: space-evenly;
}
.category-3-1{
  text-align: center;
  font-size: 16px;
}
.category-2{
  width: 80%;
  height: 25px;
  line-height: 25px;
  padding: 1vh 0;
  background: #2A54A0;
  text-align: center;
  margin: 20px auto;

  color: #FFFFFF;
}
.category-1{
  background: #EBEBEB;
  width: 90%;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  border-radius: 5px;
}
.category-4{
  height: 40px;
  line-height: 40px;
  display: flex;
}
.category-4-1{
  font-size: 16px;
  margin-left: 15px;
}
.category-4-2{
  margin-left: 60px;
}
.category-5{
  height: 40px;
  line-height: 40px;
  font-size: 16px;
  margin-right: 15px;
}
.category-1-1-1{
  background: #C3C3C3;
  height: 2.5vh;
  width: 1px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: auto 0;
}
.category-1-1-2{
  color: #4C6BAA;
  font-size: 1.8vh;
  padding: 10px 10px;
  box-sizing: border-box;
}
.category-1-1{
  display: flex;
}
.category-1-2{
  height: 40px;
}
.home {
  background-color: #EBEBEB;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  height: 100%;
  min-height: 100vh;
  padding-top: env(safe-area-inset-top);
  padding-bottom: env(safe-area-inset-bottom);
}
.home-lingqu-jixu{
  background-color: #FFFFFF;
  border-radius: 10px;
  width: 95%;
  margin: 15px auto;
  height: auto;
  //height: 180px;
}
.home-lingqu-jixu-1{
  background-color: #FFFFFF;
  border-radius: 10px;
  width: 95%;
  margin: 15px auto;
  height: auto;
  //height: 420px;
}
.home-lingqu-jixu-top{
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-left: 5px;
}
.home-lingqu-jixu-top-left{
  display: flex;
  align-items: center;
  justify-content: center;
}
.img-linqu-jixu-top-left-img{
  scale: 0.6;
}
.img-linqu-jixu-top-left-title{
  font-weight: bolder;
}
.home-ling-title-right{
  font-size: 14px;
  margin-right: 20px;
}
</style>